<template>
  <view class="wecom">
    <u-navbar :title="$t('微信福利')"></u-navbar>
    <view
      class="wecom_view"
      :style="'height: calc(100vh - 48px - ' + StatusBarRpx + 'rpx)'">
      <img
        class="wecom_bg_img"
        show-menu-by-longpress
        :src="bgImg" />
      <!-- #ifndef MP-WEIXIN -->
      <view
        class="sava-btn"
        @click="savaImage"
        >{{$t('保存图片')}}</view
      >
      <!-- #endif -->
    </view>

    <!-- 用于h5 -->
    <a
      :href="bgImg"
      download="image.jpg"
      ref="downloadLink"
      style="display: none"
      >Download</a
    >
    <uni-popup
      ref="popup"
      type="top"
      heigth="200">
      <view class="qweqwe"
        >{{$t('申请相册权限')}}</view
      >
    </uni-popup>
  </view>
  <!-- <image src="../../../static/image/enimg/wx.png" mode=""></image> -->
</template>

<script>
import permision from "@/js_sdk/wa-permission/permission.js";
import { app_type } from "@/utils/keyControl.js";
export default {
  data() {
    return {
      StatusBar: null,
      CustomBar: null,
      StatusBarRpx: null,
      CustomBarRpx: null,
      bgImg: "",
    };
  },
  onLoad() {
    this.mpWxImg();
    this.getHeight();
  },
  methods: {
    mpWxImg() {
      this.$http({
        url: "api/member/get_xn",
        data: {
          type: app_type,
        },
      }).then((res) => {
        if (res.data.code == 1) {
          let obj = res.data.data;
          this.bgImg =
            obj.wx_mg ||
            "../../../static/image/enimg/wx.png";
        }
      });
    },
    async savaImage() {
      // #ifdef APP-PLUS
      let value = uni.getStorageSync("is_READ_EXTERNAL_STORAGE");
      if (value != 1) {
        this.$refs.popup.open();
      }
      await this.requestAndroidPermission(
        "android.permission.READ_EXTERNAL_STORAGE"
      );
      uni.saveImageToPhotosAlbum({
        filePath: this.bgImg, // 替换为你的图片路径
        success: function () {
          uni.showToast({
            title: this.$t('保存成功'),
            icon: "success",
          });
        },
        fail: function (error) {
          uni.showToast({
            title: this.$t('保存失败'),
            icon: "none",
          });
          console.log(error);
        },
      });
      // #endif

      // #ifdef H5
      const downloadLink = this.$refs.downloadLink;
      downloadLink.href = this.bgImg;
      downloadLink.click();
      this.$tip.tip(this.$t('保存成功'), "success");
      // #endif
    },
    getHeight() {
      let _that = this;
      uni.getSystemInfo({
        success: function (e) {
          let StatusBar = 0,
            CustomBar = 0,
            CustomVal = 0,
            StatusBarRpx = 0,
            CustomBarRpx = 0,
            unitRatioVal = 0;
          // #ifndef MP
          StatusBar = e.statusBarHeight;
          if (e.platform == "android") {
            CustomBar = e.statusBarHeight + 50;
          } else {
            CustomBar = e.statusBarHeight + 45;
          }
          // #endif
          // #ifdef MP-WEIXIN
          StatusBar = e.statusBarHeight;
          let custom = wx.getMenuButtonBoundingClientRect();
          CustomVal = custom;
          CustomBar = custom.bottom + custom.top - e.statusBarHeight;
          // #endif
          // #ifdef MP-ALIPAY
          StatusBar = e.statusBarHeight;
          CustomBar = e.statusBarHeight + e.titleBarHeight;
          // #endif
          let unitRatio = 750 / uni.getSystemInfoSync().windowWidth;
          StatusBarRpx = StatusBar * unitRatio;
          CustomBarRpx = CustomBar * unitRatio;
          unitRatioVal = unitRatio;
          _that.StatusBar = StatusBar; //状态栏高度(px)
          _that.CustomBar = CustomBar; //整个标题栏高度(px)
          _that.StatusBarRpx = StatusBarRpx; //状态栏高度(rpx)
          _that.CustomBarRpx = CustomBarRpx; //整个标题栏高度(rpx)
          console.log(
            _that.StatusBar,
            _that.CustomBar,
            _that.StatusBarRpx,
            _that.CustomBarRpx
          );
        },
      });
    },
    //检查权限
    async requestAndroidPermission(permisionID) {
      var result = await permision.requestAndroidPermission(permisionID);
      var strStatus;
      if (result == 1) {
        strStatus = "已获得授权";
        this.$refs.popup.close();
      } else if (result == 0) {
        strStatus = "未获得授权";
      } else {
        strStatus = "被永久拒绝权限";
      }
      uni.setStorageSync("is_READ_EXTERNAL_STORAGE", result);
      return result;
    },
  },
};
</script>

<style lang="scss" scoped>
.wecom_view {
  height: calc(100vh - px);
  position: relative;
  .wecom_bg_img {
    width: 100%;
    height: 100%;
  }
  .sava-btn {
    width: 400rpx;
    height: 100rpx;
    background-color: #f4b650;
    position: absolute;
    top: 74%;
    border-radius: 50rpx;
    border: 3px solid #000;
    box-sizing: border-box;
    left: 50%;
    margin-left: -200rpx;
    font-size: 40rpx;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
  }
}
.qweqwe {
  background-color: #fff;
  width: 100%;
  color: #000;
  margin-top: 25%;
  padding: 20rpx;
  box-sizing: border-box;
}
</style>
